<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>产品页</title>
    <link href="css/copy_common.css" rel="stylesheet" />
    <link href="css/copy_main.css" rel="stylesheet" />
    <link href="css/copy_reset.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="css/product_css.css"/>
  </head>
  <body>
    <div class="box">
      <div class="headerBar">
        <div class="topBar">
          <div class="comWidth">
            <div class="leftArea">
              <a href="#" class="collection">收藏慕课</a>
            </div>
            <div class="rightArea">
              <span>欢迎来到慕课网</span>
              <a href="login.html">[登录]</a>
              <a href="register.html">[免费注册]</a>
            </div>
          </div>
        </div>
        <!--购物车区域-->
        <div class="logoBar">
          <div class="comWidth">
            <div class="logo fl">
              <a href="#"><img src="img/logo.png" alt="慕课网"></a>
            </div>
            <div class="search_box fl">
              <input type="text" class="search_text fl" />
              <input type="button" class="search_btn fr" value="搜索" />
            </div>
            <div class="shopCar fr">
              <span class="shopText fl">购物车</span>
              <span class="shopNum fl">0</span>
            </div>
          </div>
        </div>
        <!--导航区-->
        <div class="navBox">
          <div class="comWidth">
            <div class="shopClass fl">
              <h3>全部商品分类<i></i></h3>
            </div>
            <ul class="nav fl">
              <li>
                <a href="#" class="active">数码城</a>
              </li>
              <li>
                <a href="#">天嘿嘿</a>
              </li>
              <li>
                <a href="#">团购</a>
              </li>
              <li>
                <a href="#">发现</a>
              </li>
              <li>
                <a href="#">二手特卖</a>
              </li>
              <li>
                <a href="#" class="nobor">名品会</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
      
      <!--表示不同于模板的地方-->
      <div class="product_box comWidth clearfix">
      	 <div class="product_leftArea clearfix">
      	 	<div class="leftArea_nav">
      	 		<h3>手机、数码</h3>
      	 		<div class="leftArea_nav_item ">	
      	 			<h3>手机通讯</h3>
      	 			<ul class="nav_items clearfix">
      	 				<li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">拍照手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			</ul>
      	 		</div>
      	 		<div class="leftArea_nav_item">	
      	 			<h3>手机通讯</h3>
      	 			<ul class="nav_items clearfix">
      	 				<li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">拍照手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			</ul>
      	 		</div>
      	 		<div class="leftArea_nav_item">	
      	 			<h3>手机通讯</h3>
      	 			<ul class="nav_items clearfix">
      	 				<li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">拍照手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			</ul>
      	 		</div>
      	 		<div class="leftArea_nav_item">	
      	 			<h3>手机通讯</h3>
      	 			<ul class="nav_items clearfix">
      	 				<li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">拍照手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			</ul>
      	 		</div>
      	 		<div class="leftArea_nav_item">	
      	 			<h3>手机通讯</h3>
      	 			<ul class="nav_items clearfix">
      	 				<li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">拍照手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			  <li><a href="#">全部手机</a></li>
      	 			</ul>
      	 		</div>
      	 	</div>
      	 </div>
      	  <div class="product_rightArea clearfix">
      	 	 <!--由于index页面自己做的有点问题，自己重写banner区域-->
      	 	 <div class="product_banner clearfix">
      	 	 	<div class="banner_TOP clearfix">
      	 	 		<ul class="banner_lis">
      	 	 			<li ><img src="img/banner_01.png"/></li>
      	 	 			<li><img src="img/banner_02.png"/></li>
      	 	 			<!--表示图片的个数-->
      	 	 			<span class="img_NUM "><a class="current_index" href="#"></a><a href="#"></a><a href="#"></a></span>
      	 	 		</ul>
      	 	 	</div>
      	 	 </div>
      	 	 
      	 	 
      	 	 <!--商品列表-->
      	 	 <div class="product_shop_list clearfix">
      	 	 	 <h3>数码影像</h3>
      	 	 	 <hr />
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	
      	 	 </div>
      	 	 
      	 	  <!--商品列表-->
      	 	 <div class="product_shop_list clearfix">
      	 	 	 <h3>娱乐影音</h3>
      	 	 	 <hr />
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	 
      	 	 	  <div class="img_items">
      	 	 	 	<div class="img_area"><img src="img/shopImg.png"/></div>
      	 	 	 	<p><a href="#">文字介绍</a></p>
      	 	 	 	<p class="shop_price">￥699</p>
      	 	 	 	<p class="span_img">
      	 	 	 		<span >评论 :</span>
      	 	 	 		<span><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	  <span ><img src="img/collection.png"/></span>
      	 	 	 	</p>
      	 	 	 </div>
      	 	 	
      	 	 </div>
      	 	 
      	 </div>
      	 
      	 
      	 
      	 
      	 <!--product模板结束的地方-->
      </div>

     
    <div class="footer_space"></div>


      <!--底部区-->
      <div class="footer">
        <p>
          <a href="#">慕课简介</a>
          <i>|</i>
          <a href="#">慕课公告</a>
          <i>|</i>
          <a href="#">招纳贤士</a>
          <i>|</i>
          <a href="#">联系我们</a>
          <i>|</i>
          <a href="#">客服热线：400-675-1234</a>
        </p>
        <p>
          Copyright © 2006 - 2014 慕课版权所有&nbsp;&nbsp;&nbsp;京ICP备09037834号 &nbsp;&nbsp;&nbsp;某市公安局龙潭分局备案编号：32432421231
        </p>
        <p class="web">
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
        </p>
      </div>
    </div>
  </body>
</html>